<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html 
      xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:c="http://java.sun.com/jsp/jstl/core"
      xmlns:ui="http://java.sun.com/jsf/facelets">

    <h:body>
        <ui:composition template="WEB-INF/template/master.xhtml">




            <ui:define name="header">
                
                
                <!--Zusätliche Scripte für um bei Smartphoneverwendung andere Ansicht zu laden-->
                <script type="text/javascript"   src="resources/js/smartphone.special.js"/>
                <!-- Beim Resizen des Browsers wird Seite neu geladen - behebt Probleme bei Smartphones in der Portraitansicht -->
                <script type="text/javascript"   >window.onresize = reloadWeek;</script>
                <!-- HEADER -->
                <div data-role="header" data-theme="a" data-position="inline">
                    <a href="options.xhtml" data-thema="a" data-iconpos="notext" class="ui-btn-left" data-icon="gear"></a>
                    <h1>Woche</h1>
                    <a href="addLecture.xhtml" data-thema="a" data-icon="plus" data-iconpos="notext" class="ui-btn-right"/>
                </div>
            </ui:define>

            <ui:define name="content" >
                <!--Wenn ID-Courseschedule korrekt-->
                #{timetableBean.logging("week")}
                <c:if test="#{timetableBean.validateParameter()==true}">
                    <!--Wochenansicht für Tablet + Desktop -->


                    <div data-role="content" data-theme="a" id="normal">


                        <div class="ui-grid-e" data-theme="a">
                            <div class="ui-block-a">
                                <c:set var="currentDay" value="Montag" />
                                <c:set var="counter" value="0" />
                                <c:forEach var="Lecturedate" items="#{timetableBean.getLectureDateCollectionByCourseSchedule()}">

                                    <c:if test="#{Lecturedate.getDay()==currentDay}">
                                        <!-- Wurde der List Divider schon gesetzt? Damit er nicht über jeder VL angezeigt wird! -->
                                        <c:if test="#{counter==0}">

                                            <ul data-role="listview" data-inset="true" >
                                                <li data-role="list-divider">#{Lecturedate.getDay()}</li>
                                            </ul> 
                                            <c:set var="counter" value="1" />

                                        </c:if>

                                        <ul data-role="listview" data-inset="true" >
                                            <li>
                                                <a>
                                                    <c:if test="#{Lecturedate.isUpdate() == true}">
                                                        <p class="ui-week-update">UPDATE</p>
                                                    </c:if>
                                                    <h3 class="ui-li-week-heading">#{Lecturedate.getStarttimeShort()} #{Lecturedate.getEndtime()}</h3>
                                                    <p class="ui-li-desc-week-vl">#{Lecturedate.getLecture().getLecname()}</p>
                                                    <p class="ui-li-desc-week-rm">#{Lecturedate.getRoom()}</p>
                                                </a>

                                                <a href="week.xhtml?del=#{Lecturedate.getIdlecturedate()}&amp;sess=#{timetableBean.getSessionidFromBean()}&amp;rand=#{timetableBean.getRandomForURL()}" data-icon="minus" data-theme="a">entfernen</a>
                                            </li>
                                        </ul>
                                    </c:if>

                                </c:forEach>
                            </div>
                            <div class="ui-block-b">
                                <c:set var="currentDay" value="Dienstag" />
                                <c:set var="counter" value="0" />
                                <c:forEach var="Lecturedate" items="#{timetableBean.getLectureDateCollectionByCourseSchedule()}">

                                    <c:if test="#{Lecturedate.getDay()==currentDay}">
                                        <!-- Wurde der List Divider schon gesetzt? Damit er nicht über jeder VL angezeigt wird! -->
                                        <c:if test="#{counter==0}">

                                            <ul data-role="listview" data-inset="true" >
                                                <li data-role="list-divider">#{Lecturedate.getDay()}</li>
                                            </ul> 
                                            <c:set var="counter" value="1" />

                                        </c:if>

                                        <ul data-role="listview" data-inset="true" >
                                            <li>
                                                <a>
                                                    <h3 class="ui-li-week-heading">#{Lecturedate.getStarttimeShort()} #{Lecturedate.getEndtime()}</h3>
                                                    <p class="ui-li-desc-week-vl">#{Lecturedate.getLecture().getLecname()}</p>
                                                    <p class="ui-li-desc-week-rm">#{Lecturedate.getRoom()}</p>
                                                </a>

                                                <a href="week.xhtml?del=#{Lecturedate.getIdlecturedate()}&amp;sess=#{timetableBean.getSessionidFromBean()}&amp;rand=#{timetableBean.getRandomForURL()}" data-icon="minus" data-theme="a">entfernen</a>
                                            </li>
                                        </ul>
                                    </c:if>

                                </c:forEach>
                            </div>
                            <div class="ui-block-c">
                                <c:set var="currentDay" value="Mittwoch" />
                                <c:set var="counter" value="0" />
                                <c:forEach var="Lecturedate" items="#{timetableBean.getLectureDateCollectionByCourseSchedule()}">

                                    <c:if test="#{Lecturedate.getDay()==currentDay}">
                                        <!-- Wurde der List Divider schon gesetzt? Damit er nicht über jeder VL angezeigt wird! -->
                                        <c:if test="#{counter==0}">

                                            <ul data-role="listview" data-inset="true" >
                                                <li data-role="list-divider">#{Lecturedate.getDay()}</li>
                                            </ul> 
                                            <c:set var="counter" value="1" />

                                        </c:if>

                                        <ul data-role="listview" data-inset="true" >
                                            <li>
                                                <a>
                                                    <h3 class="ui-li-week-heading">#{Lecturedate.getStarttimeShort()} #{Lecturedate.getEndtime()}</h3>
                                                    <p class="ui-li-desc-week-vl">#{Lecturedate.getLecture().getLecname()}</p>
                                                    <p class="ui-li-desc-week-rm">#{Lecturedate.getRoom()}</p>
                                                </a>

                                                <a href="week.xhtml?del=#{Lecturedate.getIdlecturedate()}&amp;sess=#{timetableBean.getSessionidFromBean()}&amp;=rand=#{timetableBean.getRandomForURL()}" data-icon="minus" data-theme="a">entfernen</a>
                                            </li>
                                        </ul>
                                    </c:if>

                                </c:forEach>
                            </div>
                            <div class="ui-block-d">
                                <c:set var="currentDay" value="Donnerstag" />
                                <c:set var="counter" value="0" />
                                <c:forEach var="Lecturedate" items="#{timetableBean.getLectureDateCollectionByCourseSchedule()}">

                                    <c:if test="#{Lecturedate.getDay()==currentDay}">
                                        <!-- Wurde der List Divider schon gesetzt? Damit er nicht über jeder VL angezeigt wird! -->
                                        <c:if test="#{counter==0}">

                                            <ul data-role="listview" data-inset="true" >
                                                <li data-role="list-divider">#{Lecturedate.getDay()}</li>
                                            </ul> 
                                            <c:set var="counter" value="1" />

                                        </c:if>

                                        <ul data-role="listview" data-inset="true" >
                                            <li>
                                                <a>
                                                    <h3 class="ui-li-week-heading">#{Lecturedate.getStarttimeShort()} #{Lecturedate.getEndtime()}</h3>
                                                    <p class="ui-li-desc-week-vl">#{Lecturedate.getLecture().getLecname()}</p>
                                                    <p class="ui-li-desc-week-rm">#{Lecturedate.getRoom()}</p>
                                                </a>

                                                <a href="week.xhtml?del=#{Lecturedate.getIdlecturedate()}&amp;sess=#{timetableBean.getSessionidFromBean()}" data-icon="minus" data-theme="a">entfernen</a>
                                            </li>
                                        </ul>
                                    </c:if>

                                </c:forEach>
                            </div>
                            <div class="ui-block-e">
                                <c:set var="currentDay" value="Freitag" />
                                <c:set var="counter" value="0" />
                                <c:forEach var="Lecturedate" items="#{timetableBean.getLectureDateCollectionByCourseSchedule()}">

                                    <c:if test="#{Lecturedate.getDay()==currentDay}">
                                        <!-- Wurde der List Divider schon gesetzt? Damit er nicht über jeder VL angezeigt wird! -->
                                        <c:if test="#{counter==0}">

                                            <ul data-role="listview" data-inset="true" >
                                                <li data-role="list-divider">#{Lecturedate.getDay()}</li>
                                            </ul> 
                                            <c:set var="counter" value="1" />

                                        </c:if>

                                        <ul data-role="listview" data-inset="true" >
                                            <li>
                                                <a>
                                                    <h3 class="ui-li-week-heading">#{Lecturedate.getStarttimeShort()} #{Lecturedate.getEndtime()}</h3>
                                                    <p class="ui-li-desc-week-vl">#{Lecturedate.getLecture().getLecname()}</p>
                                                    <p class="ui-li-desc-week-rm">#{Lecturedate.getRoom()}</p>
                                                </a>

                                                <a href="week.xhtml?del=#{Lecturedate.getIdlecturedate()}&amp;sess=#{timetableBean.getSessionidFromBean()}&amp;rand=#{timetableBean.getRandomForURL()}" data-icon="minus" data-theme="a">entfernen</a>
                                            </li>
                                        </ul>
                                    </c:if>

                                </c:forEach>
                            </div>
                            <div class="ui-block-f">
                                <c:set var="currentDay" value="Samstag" />
                                <c:set var="counter" value="0" />
                                <c:forEach var="Lecturedate" items="#{timetableBean.getLectureDateCollectionByCourseSchedule()}">

                                    <c:if test="#{Lecturedate.getDay()==currentDay}">
                                        <!-- Wurde der List Divider schon gesetzt? Damit er nicht über jeder VL angezeigt wird! -->
                                        <c:if test="#{counter==0}">

                                            <ul data-role="listview" data-inset="true" >
                                                <li data-role="list-divider">#{Lecturedate.getDay()}</li>
                                            </ul> 
                                            <c:set var="counter" value="1" />

                                        </c:if>

                                        <ul data-role="listview" data-inset="true" >
                                            <li>
                                                <a>
                                                    <h3 class="ui-li-week-heading">#{Lecturedate.getStarttimeShort()} #{Lecturedate.getEndtime()}</h3>
                                                    <p class="ui-li-desc-week-vl">#{Lecturedate.getLecture().getLecname()}</p>
                                                    <p class="ui-li-desc-week-rm">#{Lecturedate.getRoom()}</p>
                                                </a>

                                                <a href="week.xhtml?del=#{Lecturedate.getIdlecturedate()}&amp;sess=#{timetableBean.getSessionidFromBean()}&amp;rand=#{timetableBean.getRandomForURL()}" data-icon="minus" data-theme="a">entfernen</a>
                                            </li>
                                        </ul>
                                    </c:if>

                                </c:forEach>
                            </div>
                        </div>

                    </div>

                    <!--Wochenansicht für Smartphone -->
                    <!-- ########################### -->
                    <!-- ########################### -->
                    <!-- ########################### -->
                    <!-- ########################### -->
                    <!-- ########################### -->
                    <div data-role="content" data-theme="a" id="smartphone">


                        <div class="ui-grid-e" data-theme="a">
                            <div class="ui-block-a">
                                <c:set var="currentDay" value="Montag" />
                                <c:set var="counter" value="0" />
                                <c:forEach var="Lecturedate" items="#{timetableBean.getLectureDateCollectionByCourseSchedule()}">

                                    <c:if test="#{Lecturedate.getDay()==currentDay}">
                                        <!-- Wurde der List Divider schon gesetzt? Damit er nicht über jeder VL angezeigt wird! -->
                                        <c:if test="#{counter==0}">

                                            <ul data-role="listview" data-inset="true" >
                                                <li data-role="list-divider" class="ui-week-smartphone">
                                                    #{Lecturedate.getDayShort()}             
                                                </li>
                                            </ul> 
                                            <c:set var="counter" value="1" />

                                        </c:if>

                                        <ul data-role="listview" data-inset="true" >
                                            <li>
                                                <c:if test="#{Lecturedate.isUpdate() == true}">
                                                    <p class="ui-week-update">UPDATE</p>
                                                </c:if>
                                                <p class="ui-li-week-heading"><img src="resources/images/icon_uhrzeit.png" width="9" height="9" alt="Uhrzeit"></img> #{Lecturedate.getStarttimeShortSmartphone()}</p>
                                                <p class="ui-li-desc-week-vl">#{Lecturedate.getLecture().getLecname()}</p>
                                                <p class="ui-li-desc-week-rm">#{Lecturedate.getRoom()}</p>
                                            </li>
                                        </ul>
                                    </c:if>

                                </c:forEach>
                            </div>
                            <div class="ui-block-b">
                                <c:set var="currentDay" value="Dienstag" />
                                <c:set var="counter" value="0" />
                                <c:forEach var="Lecturedate" items="#{timetableBean.getLectureDateCollectionByCourseSchedule()}">

                                    <c:if test="#{Lecturedate.getDay()==currentDay}">
                                        <!-- Wurde der List Divider schon gesetzt? Damit er nicht über jeder VL angezeigt wird! -->
                                        <c:if test="#{counter==0}">

                                            <ul data-role="listview" data-inset="true">
                                                <li data-role="list-divider" class="ui-week-smartphone">
                                                    #{Lecturedate.getDayShort()}
                                                </li>
                                            </ul> 
                                            <c:set var="counter" value="1" />

                                        </c:if>

                                        <ul data-role="listview" data-inset="true" >
                                            <li>
                                                <p class="ui-li-week-heading"><img src="resources/images/icon_uhrzeit.png" width="9" height="9" alt="Uhrzeit"></img> #{Lecturedate.getStarttimeShortSmartphone()}</p>
                                                <p class="ui-li-desc-week-vl">#{Lecturedate.getLecture().getLecname()}</p>
                                                <p class="ui-li-desc-week-rm">#{Lecturedate.getRoom()}</p>
                                            </li>
                                        </ul>
                                    </c:if>

                                </c:forEach>
                            </div>
                            <div class="ui-block-c">
                                <c:set var="currentDay" value="Mittwoch" />
                                <c:set var="counter" value="0" />
                                <c:forEach var="Lecturedate" items="#{timetableBean.getLectureDateCollectionByCourseSchedule()}">

                                    <c:if test="#{Lecturedate.getDay()==currentDay}">
                                        <!-- Wurde der List Divider schon gesetzt? Damit er nicht über jeder VL angezeigt wird! -->
                                        <c:if test="#{counter==0}">

                                            <ul data-role="listview" data-inset="true" >
                                                <li data-role="list-divider" class="ui-week-smartphone">
                                                    #{Lecturedate.getDayShort()}
                                                </li>
                                            </ul> 
                                            <c:set var="counter" value="1" />

                                        </c:if>

                                        <ul data-role="listview" data-inset="true" >
                                            <li>
                                                <p class="ui-li-week-heading"><img src="resources/images/icon_uhrzeit.png" width="9" height="9" alt="Uhrzeit"></img> #{Lecturedate.getStarttimeShortSmartphone()}</p>
                                                <p class="ui-li-desc-week-vl">#{Lecturedate.getLecture().getLecname()}</p>
                                                <p class="ui-li-desc-week-rm">#{Lecturedate.getRoom()}</p>
                                            </li>
                                        </ul>
                                    </c:if>

                                </c:forEach>
                            </div>
                            <div class="ui-block-d">
                                <c:set var="currentDay" value="Donnerstag" />
                                <c:set var="counter" value="0" />
                                <c:forEach var="Lecturedate" items="#{timetableBean.getLectureDateCollectionByCourseSchedule()}">

                                    <c:if test="#{Lecturedate.getDay()==currentDay}">
                                        <!-- Wurde der List Divider schon gesetzt? Damit er nicht über jeder VL angezeigt wird! -->
                                        <c:if test="#{counter==0}">

                                            <ul data-role="listview" data-inset="true" >
                                                <li data-role="list-divider" class="ui-week-smartphone">
                                                    #{Lecturedate.getDayShort()}
                                                </li>
                                            </ul> 
                                            <c:set var="counter" value="1" />

                                        </c:if>

                                        <ul data-role="listview" data-inset="true" >
                                            <li>
                                                <p class="ui-li-week-heading"><img src="resources/images/icon_uhrzeit.png" width="9" height="9" alt="Uhrzeit"></img> #{Lecturedate.getStarttimeShortSmartphone()}</p>
                                                <p class="ui-li-desc-week-vl">#{Lecturedate.getLecture().getLecname()}</p>
                                                <p class="ui-li-desc-week-rm">#{Lecturedate.getRoom()}</p>
                                            </li>
                                        </ul>
                                    </c:if>

                                </c:forEach>
                            </div>
                            <div class="ui-block-e">
                                <c:set var="currentDay" value="Freitag" />
                                <c:set var="counter" value="0" />
                                <c:forEach var="Lecturedate" items="#{timetableBean.getLectureDateCollectionByCourseSchedule()}">

                                    <c:if test="#{Lecturedate.getDay()==currentDay}">
                                        <!-- Wurde der List Divider schon gesetzt? Damit er nicht über jeder VL angezeigt wird! -->
                                        <c:if test="#{counter==0}">

                                            <ul data-role="listview" data-inset="true" >
                                                <li data-role="list-divider" class="ui-week-smartphone">
                                                    #{Lecturedate.getDayShort()}
                                                </li>
                                            </ul> 
                                            <c:set var="counter" value="1" />

                                        </c:if>

                                        <ul data-role="listview" data-inset="true" >
                                            <li>
                                                <p class="ui-li-week-heading"><img src="resources/images/icon_uhrzeit.png" width="9" height="9" alt="Uhrzeit"></img> #{Lecturedate.getStarttimeShortSmartphone()}</p>
                                                <p class="ui-li-desc-week-vl">#{Lecturedate.getLecture().getLecname()}</p>
                                                <p class="ui-li-desc-week-rm">#{Lecturedate.getRoom()}</p>
                                            </li>
                                        </ul>
                                    </c:if>

                                </c:forEach>
                            </div>
                            <div class="ui-block-f">
                                <c:set var="currentDay" value="Samstag" />
                                <c:set var="counter" value="0" />
                                <c:forEach var="Lecturedate" items="#{timetableBean.getLectureDateCollectionByCourseSchedule()}">

                                    <c:if test="#{Lecturedate.getDay()==currentDay}">
                                        <!-- Wurde der List Divider schon gesetzt? Damit er nicht über jeder VL angezeigt wird! -->
                                        <c:if test="#{counter==0}">

                                            <ul data-role="listview" data-inset="true" >
                                                <li data-role="list-divider" class="ui-week-smartphone">
                                                    #{Lecturedate.getDayShort()}
                                                </li>
                                            </ul> 
                                            <c:set var="counter" value="1" />

                                        </c:if>

                                        <ul data-role="listview" data-inset="true" >
                                            <li>
                                                <p class="ui-li-week-heading"><img src="resources/images/icon_uhrzeit.png" width="9" height="9" alt="Uhrzeit"></img> #{Lecturedate.getStarttimeShortSmartphone()}</p>
                                                <p class="ui-li-desc-week-vl">#{Lecturedate.getLecture().getLecname()}</p>
                                                <p class="ui-li-desc-week-rm">#{Lecturedate.getRoom()}</p>
                                            </li>
                                        </ul>
                                    </c:if>

                                </c:forEach>
                            </div>
                        </div>
                    </div>
                    
                                        <!--Wochenansicht für Smartphone_portrait -->
                    <!-- ########################### -->
                    <!-- ########################### -->
                    <!-- ########################### -->
                    <!-- ########################### -->
                    <!-- ########################### -->
                    <div data-role="content" data-theme="a" id="smartphone_portrait">

                        <c:set var="lastDay" value="test" />
                        

                        <c:forEach var="Lecturedate" items="#{timetableBean.getLectureDateCollectionByCourseSchedule()}">
                        
                                <!--Wenn sich der Wochentag ändert, beginne eine neue Liste-->
                                <c:if test="#{Lecturedate.getDay()!=lastDay}">
                                    <c:set var="lastDay" value="#{Lecturedate.getDay()}" />

                                    <ul data-role="listview" data-inset="true" >
                                        <li data-role="list-divider">#{Lecturedate.getDay()}</li>
                                    </ul>
                                </c:if>


                                <ul data-role="listview" data-inset="true" >
                                    <li>
                                        <a><h3 class="ui-li-day-heading-1">#{Lecturedate.getStarttimeShort()} #{Lecturedate.getEndtime()}</h3>
                                            <c:if test="#{Lecturedate.isUpdate() == true}">
                                                <p class="ui-day-update-top">UPDATE</p>
                                            </c:if>
                                            <h3 class="ui-li-day-heading-2">#{Lecturedate.getLecture().getLecname()}</h3>
                                            <p class="ui-li-desc">#{Lecturedate.getRoom()}</p>
                                            <c:forEach var='Lecturer' items="#{Lecturedate.getLecturerCollection()}">
                                                <p class="ui-li-desc">#{Lecturer.getWholeName()}</p>
                                            </c:forEach>
                                            <c:if test="#{Lecturedate.isUpdate() == true}">
                                                <p class="ui-day-update-bottom">aktualisiert am: #{Lecturedate.getTimestamplecShort()}</p>
                                            </c:if>
                                        </a>
                                        <a href="week.xhtml?del=#{Lecturedate.getIdlecturedate()}&amp;sess=#{timetableBean.getSessionidFromBean()}&amp;rand=#{timetableBean.getRandomForURL()}" data-icon="minus" data-theme="a">entfernen</a>
                                    </li>

                                </ul>

                            
                        </c:forEach>
                       
                   
                    </div>

                    <!--Eine der beiden Wochenachiten wird je nach Auflösung gelöscht -->
                    <script type="text/javascript">remove()</script>
                    
                    
                    
                    
                   
                </c:if>
                
                

            </ui:define>


            <ui:define name="footer">
                <!-- Footer -->
                <div data-role="footer" data-theme="a" data-position="fixed" data-id="day_week_exams">

                    <div data-role="navbar" data-theme="a">
                        <ul>
                            <li><a href="day.xhtml?schedule=#{timetableBean.coursescheduleid}&amp;rand=#{timetableBean.getRandomForURL()}">Heute</a></li>
                            <li><a class="ui-btn-active" id="week" href="week.xhtml?rand=#{timetableBean.getRandomForURL()}">Woche</a></li>
                            <li><a href="exams.xhtml?rand=#{timetableBean.getRandomForURL()}">Prüfungen</a></li>
                        </ul>
                    </div>
                </div>

                   </ui:define>

        </ui:composition>
    </h:body>
  
</html>
 
